import 'package:valovault_reminder/common/config/val_assets_name.dart';
import 'package:flutter/material.dart';

class ValReminderCoinShopGridCell extends StatefulWidget {
  final String exchangeCoin; //金币数
  final double discount; //折扣
  final String originPrice; //原价
  final String price; //当前价
  final bool hotTag; //hot

  final Function()? onTap;                               //点击事件

  const ValReminderCoinShopGridCell({super.key,
    this.exchangeCoin = '',
    this.discount = 0,
    this.originPrice = '',
    this.price = '',
    this.hotTag = false,
    this.onTap});

  @override
  State<ValReminderCoinShopGridCell> createState() => _ValReminderCoinShopGridCellState();
}

class _ValReminderCoinShopGridCellState extends State<ValReminderCoinShopGridCell> {

  String doubleToString(double value) {
    String result = value.toString();
    if (!result.contains('.')) {
      return result;
    }

    while (result[result.length - 1] == '0') {
      result = result.substring(0, result.length - 1); // 删除最后一位

      if (result[result.length - 1] != '.') {
        break; // 当结果不包含小数点时，停止删除操作
      }
    }

    if (result[result.length - 1] == '.') {
      result = result.substring(0, result.length - 1);
    }

    return result;
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: widget.onTap,
      child: Container(
        height: 88,
        margin: const EdgeInsets.only(bottom: 16),
        child: Stack(
          children: [
            Positioned(
              top: 20, left: 0, right: 0, bottom: 0,
              child: Container(
                decoration: const BoxDecoration(
                  color: Color(0xFF1A125E),
                  borderRadius: BorderRadius.all(Radius.circular(5)),
                ),
                child: Column(
                  children: [
                    Expanded(
                      flex: 1,
                      child: Column(
                        children: [
                          Container(
                            margin: const EdgeInsets.only(top: 10, bottom: 4),
                            width: 42, height: 35,
                            alignment: Alignment.center,
                            decoration: const BoxDecoration(
                              color: Color.fromRGBO(247, 227, 201, 0.5),
                              borderRadius: BorderRadius.all(Radius.circular(5)),
                            ),
                            child: Image.asset('${ValAssetsName.ASSETS_Message}val_coin_card_coin_icon.png', width: 34, height: 32, fit:  BoxFit.cover,),
                          ),
                          if (widget.discount > 0) //折扣
                            Text("${doubleToString(widget.discount * 100)}% off",
                              style: const TextStyle(color: Color(0xFFCECECE), fontSize: 10, fontWeight: FontWeight.w600,),),
                          // 现价
                          Text(widget.exchangeCoin,
                            style: const TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.w600),),
                          const Padding(padding: EdgeInsets.only(left: 8)),
                          // 原价
                          if (widget.discount > 0 && widget.price != widget.originPrice)
                            Text("\$${widget.originPrice}",
                              style: const TextStyle(color: Color(0xFFCECECE), fontSize: 10, fontWeight: FontWeight.w600, decoration: TextDecoration.lineThrough),),
                        ],
                      ),
                    ),
                    const Padding(padding: EdgeInsets.only(left: 6)),
                    Container(
                      height: 42,
                      alignment: Alignment.center,
                      padding: const EdgeInsets.only(left: 5, right: 5),
                      decoration: const BoxDecoration(
                        color: Color.fromRGBO(247, 227, 201, 0.5),
                        borderRadius: BorderRadius.all(Radius.circular(5)),
                      ),
                      child: Container(
                        height: 23,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(22.0),
                          gradient: const LinearGradient(
                            begin: Alignment.centerLeft,
                            end: Alignment.centerRight,
                            colors: [Color(0xFFE8A229), Color(0xFFF9C03D), Color(0xFFFCCC41),],
                          ),
                        ),
                        child: Text("\$${widget.price}",
                          style: const TextStyle(color: Color(0xFF333333), fontSize: 14, fontWeight: FontWeight.w600),),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            if (widget.discount > 0 && widget.price != widget.originPrice)
              Positioned(
                top: 0, right: 0,
                child: Container(
                  width: 70,
                  height: 20,
                  alignment: Alignment.center,
                  clipBehavior: Clip.hardEdge,
                  decoration: const BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage('${ValAssetsName.ASSETS_Message}val_coin_card_big_ground.png'),
                        fit: BoxFit.cover),
                  ),
                  child: const Text("Big Deal",
                    style: TextStyle(color: Color(0xFF333333), fontSize: 9, fontWeight: FontWeight.w500),),
                ),
              ),
            // hot
            if (widget.hotTag)
              Positioned(
                top: 0, right: 0,
                child: Container(
                  width: 70,
                  height: 20,
                  alignment: Alignment.centerRight,
                  clipBehavior: Clip.hardEdge,
                  decoration: const BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage('${ValAssetsName.ASSETS_Message}val_coin_card_hot_ground.png'),
                        fit: BoxFit.cover),
                  ),
                  child: Row(
                    children: [
                      const Padding(padding: EdgeInsets.only(left: 12)),
                      Image.asset('${ValAssetsName.ASSETS_Message}val_coin_card_hot_icon.png', width: 12, height: 12, fit:  BoxFit.cover,),
                      const Padding(padding: EdgeInsets.only(left: 4)),
                      const Text("HOT",
                        style: TextStyle(color: Colors.white, fontSize: 9, fontWeight: FontWeight.w700),),
                    ],
                  ),
                ),
              ),
          ],
        ),

      ),
    );
  }
}
